<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			body{
				background-color: #f5f5f5;
			}
			
			#container{
				height: 500px;
				width: 850px;
				background: white;
				margin: 0px auto;
				padding-top: 5px;
			}
			
			p{
				font-family: "微软雅黑";
				font-size: 30px;
				color: #424242;
				text-align: center;
				
			}
			
			.in001{
				width: 360px;
				height: 50px;
				margin: 30px auto;
				display: block;
				font-family: "微软雅黑";
				font-size: 12px;
				padding-left: 10px;
				
			}
			
			
			.in002{
				width: 376px;
				height: 50px;
				background-color: #ef5b00;
				font-family: "微软雅黑";
				font-size: 14px;
				color: white;
				border: 0px;
				margin: 0px auto;
				display: block;
			}
			
			
			.f111{
				
				width: 360px;
				border: 0px;
				border-top: 1px solid #e0e0e0;
				
				margin: 20px auto;
			}
			
			legend{
				color: #b0b0b0;
				font-size: 14px;
				font-family: "微软雅黑";
				
				padding: 2px 20px;
			}
			
			a{
				width: 30px;
				height: 30px;
				border-radius: 50%;
				/*background-color: #0288d1;*/
				display: inline-block;
			}
			
			i{
				display: block;
				width: 30px;
				height: 30px;
				background: url(icons_type.png) no-repeat;
				background-position: -19px 0;
			}
		</style>
	</head>
	<body>
		
		<div id="container">
			<p>小米帐号登录</p>
			
			<input class="in001" type="text" placeholder="邮箱/手机号码/小米帐号" />
			
			<input class="in001" type="password"  />
			
			<input class="in002" type="button" value="立即登录" />
			
			<fieldset class="f111">
				<legend align="center">其他方式登录</legend>
				<img src="qq.png" />
			</fieldset>
			
			
			
		</div>
		
		
		
	</body>
</html>
